<template>
	<section>
		<!--工具条-->
		<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
			<el-form :inline="true" :model="filters">
				<el-form-item label="状态">
		            <el-select v-model="filters.status"> 
		                <el-option v-for="item in option" :key="item.value" :label="item.label" :value="item.value" ></el-option>
		            </el-select>
				</el-form-item>	
				<el-form-item>
					<el-button type="primary" size="medium" v-on:click="handleCurrentChange(1)">查询</el-button>
				</el-form-item>
			</el-form>
		</el-col>

		<!--列表-->
		<el-table :data="list" stripe highlight-current-row v-loading="listLoading" border @selection-change="selsChange" style="width: 100%;">
			<el-table-column prop="couponsId" label="优惠券ID" min-width="40" align="center">
			</el-table-column>
			<el-table-column prop="couponsName" label="优惠券名称" min-width="60" align="center">
			</el-table-column>
			<el-table-column prop="minUseMoney" label="需满金额" min-width="60" align="center">
			</el-table-column>
			<el-table-column prop="money" label="优惠金额" min-width="60" align="center">
			</el-table-column>
			<el-table-column prop="endTime" label="到期时间" :formatter="formatDate" min-width="100" align="center">
			</el-table-column>
			<el-table-column label="状态" min-width="60" align="center">
				<template slot-scope="scope">
					<span>{{scope.row.status===0?'未使用' :scope.row.status===1?'已使用' :'已过期'}}</span>
				</template>
			</el-table-column>
		</el-table>

		<!--工具条-->
		<el-col :span="24" class="toolbar">
			<el-pagination layout="prev, pager, next, jumper" @current-change="handleCurrentChange" :page-size="pageSize" :total="total" style="float:right;">
			</el-pagination>
		</el-col>
		
	</section>
</template>

<script>
	export default {
		data() {
			return {
				filters: {
                    status:0,
				},
				option:[{
					value:0,
					label:'未使用'
				},{
					value:1,
					label:'已失效'
				}],
				list: [],
				total: 0,
				page: 1,
				pageSize: 10,
				listLoading: false,
				sels: [],
				
			}
		},
		methods: {
			selsChange: function (sels) {
				this.sels = sels;
			},
			
			//时间转换开始时间 
			formatDate(row, column) {
                let date = new Date(parseInt(row.endTime));
                let Y = date.getFullYear() + '-';
                let M = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) + '-' : date.getMonth() + 1 + '-';
                let D = date.getDate() < 10 ? '0' + date.getDate() + ' ' : date.getDate() + ' ';
                let h = date.getHours() < 10 ? '0' + date.getHours() + ':' : date.getHours() + ':';
                let m = date.getMinutes()  < 10 ? '0' + date.getMinutes() + ':' : date.getMinutes() + ':';
                let s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
                return Y + M + D + h + m + s;
            },
            zeroize(num) {
                return (String(num).length == 1 ? "0" : "") + num;
            },
            timestampFormat(timestamp) {
                var curTimestamp = parseInt(new Date().getTime() / 1000); //当前时间戳
                var timestampDiff = curTimestamp - parseInt(timestamp / 1000); // 参数时间戳与当前时间戳相差秒数
                var curDate = new Date(curTimestamp * 1000); // 当前时间日期对象
                var tmDate = new Date(parseInt(timestamp / 1000) * 1000); // 参数时间戳转换成的日期对象
                var Y = tmDate.getFullYear(),
                m = tmDate.getMonth() + 1,
                d = tmDate.getDate();
                var H = tmDate.getHours(),
                i = tmDate.getMinutes(),
                s = tmDate.getSeconds();
                return (Y + "-" + this.zeroize(m) + "-" + this.zeroize(d) + " " + this.zeroize(H) + ":" + this.zeroize(i));
            },
			handleCurrentChange(val) {
				this.page = val;
				this.getUsers();
			},
			//获取列表
			getUsers:function (){
				this.listLoading = true;
				let para = {
					page: this.page,
					size: this.pageSize,
                    userId: this.$route.query.id,
                    status:this.filters.status
				};
				var instance = this.$http.create({headers: {'content-type': 'application/x-www-form-urlencoded','admin_five_palace_token':JSON.parse(sessionStorage.getItem('token'))},
				});  
				instance.post('admin/coupon/getUserCouponsList', this.qs.stringify(para)).then(data => {
					let  res = data.data;
					if (res.code !== 0) {
						this.$message({
							message: res.msg,
							type: 'error'
						});
					} else {
						this.total = res.total;
						this.list = res.rows;
						this.listLoading = false;
					}
				});
			},
			
		},
		mounted() {
			this.getUsers();
		}
	}

</script>